<template>
    <div class="col card m10 p10">
        <label class="title" style="text-align: center;">Ping测试</label>
        <div class="row mt">
            <el-button :loading="ctx.mainFlag" @click="onClickPingMain" type="warning">Ping主控板</el-button>
            <el-button :loading="ctx.heatFlag" @click="onClickPingHeat" type="warning">Ping加热控制板</el-button>
            <el-button :loading="ctx.weightFlag" @click="onClickPingWeight" type="warning">Ping称重控制板</el-button>
        </div>
    </div>

</template>

<script setup lang="ts">
import { reactive } from 'vue';
import { dialog } from '../service/ui';
import conn from '../service/conn';
import { addr } from '../service/proto';


interface Ctx {
    mainFlag: boolean,
    heatFlag: boolean,
    weightFlag: boolean,
}

const ctx = reactive<Ctx>({
    mainFlag: false,
    heatFlag: false,
    weightFlag: false,
});

async function onClickPingMain() {
    ctx.mainFlag = true;

    try {
        await conn.conn_ping(addr.MAIN);
        dialog.succ('Ping主控板成功');
    } catch (msg) {
        dialog.err(msg);
    }

    ctx.mainFlag = false;
}

async function onClickPingHeat() {
    ctx.heatFlag = true;

    try {
        await conn.conn_ping(addr.HEAT);
        dialog.succ('Ping加热控制板成功');
    } catch (msg) {
        dialog.err(msg);
    }

    ctx.heatFlag = false;
}

async function onClickPingWeight() {
    ctx.weightFlag = true;

    try {
        await conn.conn_ping(addr.WEIGHT);
        dialog.succ('Ping称重控制板成功');
    } catch (msg) {
        dialog.err(msg);
    }

    ctx.weightFlag = false;
}

</script>
